$outline_dafault:(
    none:2px solid transparent,
    //white:2px dotted white,
    //black:2px dotted black,
);
@each $key,$value in $outline_dafault {
    .outline-default-#{$key}{
        outline: $value;
        outline-offset: 2px;
    }
}




$outline_style:(
    none:none,	//默认。定义无轮廓。
    dotted:dotted,	//定义点状的轮廓。
    dashed:dashed,	//定义虚线轮廓。
    solid:solid,	//定义实线轮廓。
    double:double,	//定义双线轮廓。双线的宽度等同于 outline-width 的值。
    groove:groove,	//定义 3D 凹槽轮廓。此效果取决于 outline-color 值。
    ridge:ridge,	//定义 3D 凸槽轮廓。此效果取决于 outline-color 值。
    inset:inset,	//定义 3D 凹边轮廓。此效果取决于 outline-color 值。
    outset:outset,// 3D 凸边轮廓。此效果取决于 outline-color 值。
    inherit:inherit,	//规定应该从父元素继承轮廓样式的设置。
);
@each $key,$value in $outline_style{
    .outline-#{$key}{
        outline-style: $value;
    }
}

/**********************************outline-width 属性****************/



$outline_width:(
    thin:thin,	//规定细轮廓。
    medium:medium,	//默认。规定中等的轮廓。
    thick:thick,	//规定粗的轮廓。
    length:length,	//允许您规定轮廓粗细的值。
    sm: 0.125rem,
    md: 0.375rem,
    lg: 0.5rem,
    xl: 0.75rem,
);
@each $key,$value in $outline_width{
    .outline-width-#{$key}{
        outline-width: $value;
    }
}


/**********************************outline-offset  属性****************/
$outline_offset :(
    length:length,	//	轮廓与边框边缘的距离。
    inherit:inherit,	//规定应从父元素继承 outline-offset 属性的值。
    sm: 0.125rem,
    md: 0.375rem,
    lg: 0.5rem,
    xl: 0.75rem,

);
@each $key,$value in $outline_offset{
    .outline-offset-#{$key}{
        outline-offset: $value;
    }
}
